<template>
  <el-timeline>
    <el-timeline-item
      v-for="(activity, index) in activities"
      :key="index"
      :color="activity.color"
    >
      <!-- :color="activity.color"
      :timestamp="activity.timestamp" -->
      <h4>{{ activity.nodeName }}</h4>
      <el-card>
        <h4>操作人:{{ activity.assignee }}</h4>
        <h4>操作时间: {{ activity.createTime }}</h4>
        <h4>{{ activity.opinion }}</h4>
      </el-card>
    </el-timeline-item>
  </el-timeline>
  <el-empty v-if="!activities.length" description="暂无记录"></el-empty>
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { useRoute } from "vue-router";
import { postApproveHistory } from "/@/api/acceptance";

const route = useRoute();
const activities = ref([]);
const getTableData = async () => {
  if (!route.query?.instanceId || !route.query?.nodeDefId) {
    return;
  }
  const { instanceId } = route.query;
  const params = {
    instanceId
  };
  const { code, data } = await postApproveHistory(params);
  if (code === 200) {
    data.forEach(item => {
      if (item.eflag === 1) {
        item.color = "#FF0000";
      } else {
        item.color = "#409EFF";
      }
      if (item.type === "recall") {
        item.opinion = "撤回";
      }
    });
    activities.value = data;
  }
};

getTableData();
</script>

<style lang="scss" scoped></style>
